<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width">
    <title>Document</title>
    <link rel="stylesheet" href="game.css"/>
    <script src="../unis/jquery-1.8.3.min.js"></script>
    <script src="../interface/interface.js"></script>
</head>
<body>
<div role="host"></div>
<audio id="audio" src="../audio/null.m4a" autoplay="autoplay">
</audio>
    <div class="content">
        <img src="../imgs/logoutBg.png" alt=""/>
    </div>
<div class="main">
    <div class="top">
        <div class="top_top">
            <div class="header">
                <p>今天是个重大的日子！</p>
            </div>
            <div class="setting">
                <ul>
                    <li>
                        <img src="../imgs/setting.png" alt=""/>
                    </li>
                    <li>
                        <img src="../imgs/chat.png" alt=""/>
                    </li>
                </ul>
            </div>
        </div>
        <div class="left" style="position: relative">
            <div class="leftTitle"  >
               <img src="../imgs/default_avatart.jpg" alt=""/>
                <div class="leftText">
                    <p style="color: #ffffff">ts</p>
                    <p style="color: #f8d107 ">1000</p>
                </div>
            </div>
                <ul class="leftPais">
                    <li class="leftPai">
                        <img src="../imgs/pai_left.png" alt=""/>
                    </li>
                </ul>
                <ul class="leftoverpais">
                        <li>
                            <img src="../imgs/pai_65.png" alt=""/>
                        </li>
                    <li>
                        <img src="../imgs/pai_65.png" alt=""/>
                    </li>
                    <li>
                        <img src="../imgs/pai_65.png" alt=""/>
                    </li>
                    <li>
                        <img src="../imgs/pai_65.png" alt=""/>
                    </li>
                </ul>
        </div>
        <div class="center">
                <div class="centerImg">
                    <p  style="border-radius:10px;padding:0 10px;font-size:0.7rem;background: #1c5523; color: #16e868 ; float: left;position: relative;top:50%;margin-top: -11.5px;margin-left: 6%;">还剩<span style="color: #f8d107 ">74</span>张</p>
                    <img src="../imgs/timer_bg.png" alt=""/>
                    <img class="dataId" style="display: block" dataId="2" src="../imgs/t2.png" alt=""/>
                    <img class="dataId" style="display: none" dataId="1" src="../imgs/t3.png" alt=""/>
                    <img class="dataId" style="display: none" dataId="3" src="../imgs/t1.png" alt=""/>
                    <p class="time">30</p>
                    <p  style="border-radius:10px; padding:0 10px; font-size:0.7rem;background: #1c5523; color: #16e868 ;float:right;position: relative;top:50%;margin-top: -11.5px;margin-right: 10%;">还剩<span style="color: #f8d107 ">7</span>局</p>
                </div>
        </div>
        <div class="right" style="position: relative" >
            <div class="RightTitle" >
                <img src="../imgs/default_avatart.jpg" alt=""/>
                <div class="RightText">
                    <p style="color: #ffffff">ts</p>
                    <p style="color: #f8d107 ">1000</p>
                </div>
            </div>
            <ul class="RightPais" style="position: relative;left:20px;">
                <li class="RightPai">
                    <img src="../imgs/pai_Right.png" alt=""/>
                </li>
            </ul>
            <ul class="rightoverpais">
                <li>
                    <img src="../imgs/pai_65.png" alt=""/>
                </li>
                <li>
                    <img src="../imgs/pai_65.png" alt=""/>
                </li>
                <li>
                    <img src="../imgs/pai_65.png" alt=""/>
                </li>
                <li>
                    <img src="../imgs/pai_65.png" alt=""/>
                </li>
            </ul>
        </div>
    </div>
    <div class="footer">
        <div class="MyTitle">
            <img src="../imgs/default_avatart.jpg" alt=""/>
            <div class="MyText">
                <p style="color: #ffffff">ts</p>
                <p style="color: #f8d107 ">1000</p>
            </div>
        </div>
        <ul class="MyPai">
        </ul>
        <ul class="MyPais">
            <li>
                <img src="../imgs/1-a.png" alt=""/>
            </li>
        </ul>
    </div>
</div>
<div class="RoomNumber">
    <p style="color: #01fcd0">09 11</p>
    <p>房间号</p>
    <p>673377</p>
    <p>卡五星</p>
    <p>襄阳玩法</p>
</div>
    <div class="Myplay">
        <ul class="mplay">

        </ul>
    </div>
<div id="over">
    <img class="_bg" src="../imgs/over_bg.png" alt=""/>
    <div class="over_main">
            <div class="over_top">
                <p class="over_time">
                    2016-8-12 10:58:11
                </p>
                <p class="over_hoom">
                    房间号:6733777 局数:1/8
                </p>
            </div>
        <div class="over_center">
            <dl class="pai_dls">
                    <dt style="float:left">ss</dt>
                    <dd class="hupais_list">
                        <ul>
                            <li>
                                <img src="../imgs/1-a.png" alt=""/>
                                <img src="../imgs/1-a.png" alt=""/>
                                <img src="../imgs/1-a.png" alt=""/>
                                <img src="../imgs/1-a.png" alt=""/>
                                <img src="../imgs/1-a.png" alt=""/>
                                <img src="../imgs/1-a.png" alt=""/>
                                <img src="../imgs/1-a.png" alt=""/>
                                <img src="../imgs/1-a.png" alt=""/>
                                <img src="../imgs/1-a.png" alt=""/>
                                <img src="../imgs/1-a.png" alt=""/>
                                <img src="../imgs/1-a.png" alt=""/>
                                <img src="../imgs/1-a.png" alt=""/>
                                <img src="../imgs/1-a.png" alt=""/>
                                <img src="../imgs/1-a.png" alt=""/>
                            </li>
                        </ul>
                        <div class="h">
                            <img  class="hImg" src="../imgs/h.png" alt=""/>
                        </div>
                        <div style="float: left;width: 20% ;font-size: 0.7rem; color: #ffffff;margin-top: 1%">
                            <div class="jifan">
                                <p>2</p>
                                <p>翻</p>
                            </div>
                            <div style="float: left;">
                                    <p>杠分</p>
                                    <p>0</p>
                            </div>
                            <div  style="float: right;margin-right: 20%;">
                                <p>总分</p>
                                <p>+0</p>
                            </div>
                        </div>
                    </dd>
                </dl>
            <dl class="pai_dls">
                <dt style="float:left;position: fixed;z-index: 100; top:35%">ss</dt>
                <dd class="hupais_list">
                    <ul>
                        <li>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                        </li>
                    </ul>
                    <div class="h">
                        <img  class="hImg" src="../imgs/h.png" alt=""/>
                    </div>
                    <div style="float: left;width: 20% ;font-size: 0.7rem; color: #ffffff;margin-top: 1%">
                        <div class="jifan">
                            <p>2</p>
                            <p>翻</p>
                        </div>
                        <div style="float: left;">
                            <p>杠分</p>
                            <p>0</p>
                        </div>
                        <div  style="float: right;margin-right: 20%;">
                            <p>总分</p>
                            <p>+0</p>
                        </div>
                    </div>
                </dd>
            </dl>
            <dl class="pai_dls">
                <dt style="float:left;position: fixed;z-index: 100; top:50%">ss</dt>
                <dd class="hupais_list">
                    <ul>
                        <li>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                            <img src="../imgs/1-a.png" alt=""/>
                        </li>
                    </ul>
                    <div class="h" >
                        <img style="visibility:visible"  class="hImg" src="../imgs/h.png" alt=""/>
                    </div>
                    <div style="float: left;width: 20% ;font-size: 0.7rem; color: #ffffff;margin-top: 1%">
                        <div class="jifan" style="visibility:visible">
                            <p>2</p>
                            <p>翻</p>
                        </div>
                        <div style="float: left;">
                            <p>杠分</p>
                            <p>0</p>
                        </div>
                        <div  style="float: right;margin-right: 20%;">
                            <p>总分</p>
                            <p>+0</p>
                        </div>
                    </div>
                </dd>
            </dl>
        </div>
        <div class="over_footer">
            <ul style="position: absolute;bottom: 18%;width: 100%;">
                <li style="text-align: center">
                    <img src="../imgs/an1.png" alt=""/>
                </li>
                <li style="text-align: left">
                    <img src="../imgs/an2.png" alt=""/>
                </li>
            </ul>
        </div>
    </div>
</div>
</body>
<script src="game.js"></script>
</html>